<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>[|.siteName|]</title>
    [|if .zTree|]
    <link rel="stylesheet" href="/static/zTree3/css/demo.css?t=5" type="text/css">
    <link rel="stylesheet" href="/static/zTree3/css/zTreeStyle/zTreeStyle.css" type="text/css"> [|end|]
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <link rel="stylesheet" href="/static/css/main.css">
    <script src="/static/layui/layui.js?s=36"></script>
    <script src="/static/js/main.js?s=2124"></script>
</head>


<form>
    <div class="layui-input-inline">
        <div class="layui-inline">
            <label class="layui-form-label" style="width:100px">公告内容:</label>
            <div class="layui-input-inline" style="width:170px">
                <input type="text" name="noticeContent" id="noticeContent" lay-verify="required|number" autocomplete="off" class="layui-input" value="">
            </div>
        </div>

        <div class="layui-inline">
            <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="queryBtn">开始查询</button>
        </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="addBtn">添加</button>
        </div>

    </div>

</form>
<div class="layui-form">
    <table class="layui-table" lay-data="{width: 'full-10', height: 'full-105', url:'', page:true, id:'idTest'}" lay-filter="dataTable" id="dataTable">
        <thead>
            <tr>
                <th lay-data="{field:'userid', width:200, fixed: true}">推广号</th>
                <th lay-data="{field:'nickname', width:200}">昵称</th>
                <th lay-data="{field:'admin', width:200}">管理员</th>
                <th lay-data="{field:'time', width:200}">时间</th>
                <th lay-data="{field:'amount', width:200}">金币数</th>
                <th lay-data="{field:'explain', width:20000}">说明</th>
            </tr>
        </thead>
        <!--       <tbody>
            <tr>
                <td>123456</td>
                <td>妈蛋</td>
                <td>admin</td>
                <td>2017年11月6日18:06:33</td>
                <td>100000</td>
                <td>测试用的 说明个锤子</td>
            </tr>
        </tbody> -->
    </table>
</div>

<script type="text/html" id="stateTpl">
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="deletebtn">删除</a>
</script>



<script>
    layui.use(['table', 'form', 'layedit', 'laydate', 'jquery', 'element'], function() {
        var form = layui.form,
            layer = layui.layer,
            layedit = layui.layedit,
            laydate = layui.laydate;
        $ = layui.jquery
        var element = layui.element;
        table = layui.table;

        //var table = layui.table;

        //日期
        laydate.render({
            elem: '#date1',
            type: 'datetime',
            format: 'yyyy-MM-dd HH:mm:ss'
        });

        laydate.render({
            elem: '#date2',
            type: 'datetime',
            format: 'yyyy-MM-dd HH:mm:ss'
        });

        //监听工具条
        table.on('tool(dataTable)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent == 'deletebtn') { //查看

                layer.confirm('确定删除吗？', function(index) {
                    var jsData = {
                        'id': data.id
                    }
                    $.post('[|urlfor "SysGamenoticeController.AjaxDel"|]', jsData, function(out) {
                        if (out.status == 0) {
                            layer.alert('删除成功了(' + out.message + ')条数据', {
                                icon: 1
                            }, function(index) {
                                layer.close(index);
                                //window.location.reload();
                                btnClick()
                            });
                        } else {
                            layer.msg(out.message)
                        }
                    }, "json");
                    // obj.del();
                    layer.close(index);
                });


                return false;

            }


        });

        //监听提交
        form.on('submit(queryBtn)', function(data) {
            btnClick()
            return false;
        });

        //监听提交
        form.on('submit(addBtn)', function(data) {
            window.location.href = "add"
            return false;
        });

        //自定义验证规则
        form.verify({
            date1: function(value) {
                if (value.length < 5) {
                    return '标题至少得5个字符啊';
                }
            },
            pass: [/(.+){6,12}$/, '密码必须6到12位'],
            content: function(value) {
                layedit.sync(editIndex);
            },
            user: function(value) {
                if (value.length < 5) {
                    return "请选择用户"
                }
            }
        });

        //监听指定开关
        form.on('switch(switchTest)', function(data) {
            layer.msg('开关checked：' + (this.checked ? 'true' : 'false'), {
                offset: '6px'
            });
            layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
        });


        $('#selectGetType').change(function() {
            var opt = $("#selectGetType").val();
            //alert(opt)
            //$("#queryBtn").trigger("submit");
            btnClick();
        });

        btnClick()

    });



    function btnClick() {
        var noticeContent = document.getElementById("noticeContent")
        repeat = document.getElementById("repeat");
        timeInterval = document.getElementById("timeInterval");
        table.render({
            elem: '#dataTable',
            //data: datas,
            where: {
                noticeContent: noticeContent.value,
            },
            url: '/sysgamenotice/table',
            done: function(res, curr, count) {},

            cols: [
                [ //标题栏
                    {
                        field: 'noticeContent',
                        title: '公告内容',
                        height: 100,
                        width: '1400'
                    }, {
                        field: 'playInterval',
                        title: '播放间隔(秒)',
                        height: 300,
                        width: 110,
                    }, {
                        field: 'repeatCount',
                        title: '重复次数',
                        height: 100,
                        width: 100
                    }, {
                        field: 'operation',
                        title: '操作',
                        height: 300,
                        width: 1000,
                        toolbar: '#stateTpl'
                    }
                ]
            ],
            skin: 'row', //表格风格
            even: true,
            page: true,
            limits: [30, 50, 100],
            limit: 50, //每页默认显示的数量
            width: 'full-10',
            rules: 'all',
            height: 'full-105'
        });
    }
</script>
</body>

</html>